import React from "react";
import { EditorMode, PanelItem, IPanelService } from "../types";
import { useInversify } from "../providers/InversifyProvider";

interface RightPanelProps {
    mode: EditorMode;
}

const RightPanel: React.FC<RightPanelProps> = ({ mode }) => {
    const container = useInversify();
    const panelService = container.get<IPanelService>("IPanelService");
    const items = panelService.getRightPanelItems(mode);

    return (
        <div className="right-panel">
            {items.map((item: PanelItem) => (
                <div key={item.id} className="panel-item">
                    <h3>{item.title}</h3>
                    {item.content}
                </div>
            ))}
        </div>
    );
};

export default RightPanel;
